<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<html>
<head>
<title>入库管理</title>
<meta name="decorator" content="default" />
<style type="text/css">
.ui-field-contain fieldset div.ui-input-text {
	float: left;
	width: 60%;
}

#selectButton {
	margin-left: 10%;
}
</style>
<script type="text/javascript">
	$()
			.ready(
					function() {
						$("#selectProductEvent ul li")
								.delegate(
										"a",
										"click",
										function() {
											var item = $(this);
											document
													.getElementById("product-id").value = item
													.attr("id");
											document
													.getElementById("product-name").value = item
													.attr("name");
											document
													.getElementById("product-spec").value = item
													.attr("spec");
											document
													.getElementById("product-retail_price").value = item
													.attr("price");
											$("#selectProduct").popup("close");
										});
						$("#inventoryInForm").validate(
								{
									submitHandler : function(form) {
										if (!$("#product-id").val()) {
											showTip("请选择要入库的产品");
										} else {
											form.submit();
										}
									},
									errorContainer : "#messageBox",
									errorPlacement : function(error, element) {
										$("#messageBox").text("输入有误，请先更正。");
										if (element.is(":checkbox")
												|| element.is(":radio")) {
											error.appendTo(element.parent()
													.parent());
										} else {
											error.insertAfter(element);
										}
									}
								});
					});

	function checkStoreProduct() {
		var id = document.getElementById("storeProduct-id").value;
		if (id < 1) {
			alert("请先选择产品");
			return false;
		}
		var count = document.getElementById("storeProduct-count").value;
		if (count < 1) {
			alert("请输入产品数量");
			return false;
		}
		return true;
	}

	function checkCanSave() {
		var ps = "${inventoryIn.systemProducts[0]}";
		if (ps != "") {
			$('#saveConfirmDialog').modal({
				keyboard : false,
				backdrop : true
			});
		} else {
			alert("请先登记全部入库产品");
		}
	}

	function beforeSave() {
		var ps = "${inventoryIn.systemProducts[0]}";
		if (ps != "") {
			$('#saveConfirmDialog').modal({
				keyboard : false,
				backdrop : true
			});
		} else {
			alert("请先登记全部入库产品");
			return false;
		}

		var content = "在保存入库单前，请再次确认本次入库信息是否全部正确？";
		var canSave = false;
		global.confirm(content, function() {
			canSave = true;
		});
		return canSave;

	};

	function doCancel() {
		var content = "是否取消本次入库操作？";
		global.confirm(content, function() {
			var url = "${ctx}/inventory/in/product/cancel";
			window.location.href = url;
		});
		return false;
	};
	function page(n, s) {
		$("#pageNo").val(n);
		$("#pageSize").val(s);
		$("#searchForm").submit();
		return false;
	}
</script>
</head>
<body>
	<div class="container">
		<c:if test="${!inProduct.editing}">
			<div style="text-align: center;">
				<h3>添加产品</h3>
			</div>
			<form:form id="inventoryInForm"
				action="${ctx}/inventory/in/product/add" class="form-input"
				modelAttribute="inProduct" method="post">
				<form:hidden path="product.id" id="product-id" />
				<div data-role="fieldcontain">
					<label>产品名称</label>
					<fieldset data-role="controlgroup" data-type="horizontal"
						data-inline="true">
						<form:input type="text" id="product-name" readonly="true"
							path="product.product.name" />
						<c:if test="${!inProduct.editing}">
							<a id="selectButton" href="#selectProduct" data-rel="popup"
								data-inline="true" data-icon="plus" data-position-to="window"
								data-transition="pop" data-role="button">添加产品</a>
						</c:if>
					</fieldset>
				</div>

				<div data-role="fieldcontain">
					<label>产品规格</label>
					<form:input path="product.product.spec" type="text"
						id="product-spec" readonly="true" />
				</div>
				<div data-role="fieldcontain">
					<label>零售价</label>
					<form:input path="product.product.retail_price" type="text"
						id="product-retail_price" readonly="true" />
				</div>
				<div data-role="fieldcontain">
					<label>进货数量</label>
					<form:input path="amount" type="number" min="1" class="required" />
				</div>
				<div class="icon-buttons">
					<a href="${ctx}/inventory/in/product/page" data-role="button"
						data-inline="true" data-icon="back" data-iconpos="notext">返回</a> <input
						data-inline="true" data-icon="check" data-iconpos="notext"
						type="submit" value="确认添加" />
				</div>
			</form:form>
			<div data-role="popup" id="selectProduct">
				<div data-role="header">
					<h1>选择店面自营产品</h1>
				</div>
				<div data-role="content" style="overflow:scroll;height:12em;"
					id="selectProductEvent">
					<ul data-role="listview" id="productsList" data-filter="true">
						<c:forEach items="${inventoryIn.systemProductList}" var="data">
							<li><a name="${data.product.name}"
								spec="${data.product.spec}" id="${data.id}"
								price="${data.product.retail_price}" href="#">${data.product.name}</a></li>
						</c:forEach>
					</ul>
				</div>
			</div>
		</c:if>
		<c:if test="${inProduct.editing}">
			<div style="text-align: center;">
				<h3>编辑产品</h3>
			</div>
			<form:form id="inventoryInForm"
				action="${ctx}/inventory/in/product/edit" class="form-input"
				modelAttribute="inProduct">
				<form:hidden path="product.id" id="product-id" />
				<div data-role="fieldcontain">
					<label>产品名称</label>
					<form:input type="text" id="product-name" readonly="true"
						path="product.product.name" />
				</div>
				<div data-role="fieldcontain">
					<label>产品规格</label>
					<form:input path="product.product.spec" type="text"
						id="product-spec" readonly="true" />
				</div>
				<div data-role="fieldcontain">
					<label>零售价(元)</label>
					<form:input path="product.product.retail_price" type="text"
						id="product-retail_price" readonly="true" />
				</div>
				<div data-role="fieldcontain">
					<label>进货数量</label>
					<form:input path="amount" type="number" min="1" class="required" />
				</div>
				<div class="icon-buttons">
					<a href="${ctx}/inventory/in/product/page" data-role="button"
						data-inline="true" data-icon="back" data-iconpos="notext">返回</a> <input
						data-inline="true" data-icon="check" data-iconpos="notext"
						type="submit" value="保存" />
				</div>
			</form:form>
		</c:if>
	</div>
</body>
</html>
